<template>
  <RouterView />
</template>

<script setup lang="ts">
import { onBeforeMount, onMounted, onUnmounted } from 'vue';
import { RouterView } from 'vue-router';
// 定义 handleResize 函数
const handleResize = () => {
  // 处理窗口大小变化的逻辑
  let w = window.innerWidth;

  if (w < 1920) {
    w = 1920;
  }
  document.getElementsByTagName('html')[0].style.fontSize = `${w / 2560}px`
}

onBeforeMount(() => {
  // 组件挂载之前被调用
  handleResize()
})

onMounted(() => {
  // 组件挂载后被调用
  // 挂载-浏览器窗口变化事件
  window.addEventListener('resize', handleResize);
})

onUnmounted(() => {
  // 组件被销毁之前调用
  // 销毁-浏览器窗口变化事件
  window.removeEventListener('resize', handleResize);
})
</script>

<style scoped lang="scss">
.container {
  padding: 10px;
}
</style>
